<template>
  <lew-flex x="start">
    <div>
      <lew-flex direction="y" x="start" gap="10px">
        <lew-flex y="end" x="start">
          <lew-tag type="fill" color="red">
            Red
          </lew-tag>
          <lew-tag type="fill" color="orange">
            Orange
          </lew-tag>
          <lew-tag type="fill" color="yellow">
            Yellow
          </lew-tag>
          <lew-tag type="fill" color="green">
            Green
          </lew-tag>
          <lew-tag type="fill" color="mint">
            Mint
          </lew-tag>
          <lew-tag type="fill" color="teal">
            Teal
          </lew-tag>
          <lew-tag type="fill" color="cyan">
            Cyan
          </lew-tag>
          <lew-tag type="fill" color="blue">
            Blue
          </lew-tag>
          <lew-tag type="fill" color="indigo">
            Indigo
          </lew-tag>
          <lew-tag type="fill" color="purple">
            Purple
          </lew-tag>
          <lew-tag type="fill" color="pink">
            Pink
          </lew-tag>
          <lew-tag type="fill" color="brown">
            Brown
          </lew-tag>
          <lew-tag type="fill" color="gray">
            Gray
          </lew-tag>
          <lew-tag type="fill" color="black">
            Black
          </lew-tag>
        </lew-flex>
        <lew-flex y="end" x="start">
          <lew-tag type="light" color="red">
            Red
          </lew-tag>
          <lew-tag type="light" color="orange">
            Orange
          </lew-tag>
          <lew-tag type="light" color="yellow">
            Yellow
          </lew-tag>
          <lew-tag type="light" color="green">
            Green
          </lew-tag>
          <lew-tag type="light" color="mint">
            Mint
          </lew-tag>
          <lew-tag type="light" color="teal">
            Teal
          </lew-tag>
          <lew-tag type="light" color="cyan">
            Cyan
          </lew-tag>
          <lew-tag type="light" color="blue">
            Blue
          </lew-tag>
          <lew-tag type="light" color="indigo">
            Indigo
          </lew-tag>
          <lew-tag type="light" color="purple">
            Purple
          </lew-tag>
          <lew-tag type="light" color="pink">
            Pink
          </lew-tag>
          <lew-tag type="light" color="brown">
            Brown
          </lew-tag>
          <lew-tag type="light" color="gray">
            Gray
          </lew-tag>
          <lew-tag type="light" color="black">
            Black
          </lew-tag>
        </lew-flex>
        <lew-flex y="end" x="start">
          <lew-tag type="ghost" color="red">
            Red
          </lew-tag>
          <lew-tag type="ghost" color="orange">
            Orange
          </lew-tag>
          <lew-tag type="ghost" color="yellow">
            Yellow
          </lew-tag>
          <lew-tag type="ghost" color="green">
            Green
          </lew-tag>
          <lew-tag type="ghost" color="mint">
            Mint
          </lew-tag>
          <lew-tag type="ghost" color="teal">
            Teal
          </lew-tag>
          <lew-tag type="ghost" color="cyan">
            Cyan
          </lew-tag>
          <lew-tag type="ghost" color="blue">
            Blue
          </lew-tag>
          <lew-tag type="ghost" color="indigo">
            Indigo
          </lew-tag>
          <lew-tag type="ghost" color="purple">
            Purple
          </lew-tag>
          <lew-tag type="ghost" color="pink">
            Pink
          </lew-tag>
          <lew-tag type="ghost" color="brown">
            Brown
          </lew-tag>
          <lew-tag type="ghost" color="gray">
            Gray
          </lew-tag>
          <lew-tag type="ghost" color="black">
            Black
          </lew-tag>
        </lew-flex>
      </lew-flex>
    </div>
  </lew-flex>
</template>
